<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>终端系_统首页</title>
    <script src="js\Jquery3.1.1.js"></script>
    <script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
    <script src="layui/lay/modules/layer.js" type="text/javascript" charset="utf-8"></script>
    <link rel="stylesheet" type="text/css" href="layui/css/modules/layer/default/layer.css"/>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
    <style>
        #list > div {
            background-color: white;
            color: #000;
            font-size: 20px;
            width: 15%;
            height: 100%;
            border-radius: 10px;
            box-shadow: 10px 10px 10px #000000;
        }

        #list > div > a {
            width: 100%;
            height: 100%;
            padding: 10px;
            text-align: center;
            color: #FF5722;
        }

        #list > div > a > div {
            height: 50%;
        }

        .layui-icon {
            font-size: 50px;
        }
    </style>
</head>
<body style="background-color: #2C3E50">
<div style="display: flex;align-items: center;justify-content: center;position: absolute;width: 100%;height: 100%;flex-direction: column">
    <div style="font-size: 30px;color: #26A65B;margin-bottom: 30px">图书馆管理系统 —— 终端系统</div>
    <div id="list" style="display: flex;justify-content:space-around;width: 80%;height: 30%">
        <div>
            <a href="manager">
                <div>终端调试</div>
                <div style=" color: #1E9FFF; " class="layui-icon">&#xe716;</div>
            </a>
        </div>

        <div>
            <a href="jieshu">
                <div>RFID AFI 00（借书）</div>
                <div style=" color: #1E9FFF;" class="layui-icon">&#xe66b;</div>
            </a>
        </div>

        <div>
            <a href="huanshu">
                <div>RFID AFI 11（还书）</div>
                <div style=" color: #1E9FFF; " class="layui-icon">&#xe668;</div>
            </a>
        </div>
        <div>
            <a href="importBook">
                <div>录书系统</div>
                <div style=" color: #1E9FFF; " class="layui-icon">&#xe656;</div>
            </a>
        </div>

        <div>
            <a href="jiaweibangding">
                <div>架位绑定</div>
                <div style=" color: #1E9FFF;" class="layui-icon">&#xe6b2;</div>
            </a>
        </div>

        <div>
            <a href="shangjia">
                <div>归还上架</div>
                <div style=" color: #1E9FFF;" class="layui-icon">&#xe6b2;</div>
            </a>
        </div>

    </div>
</div>
<script>
    var ip = "";
    var port = "";
    $.ajax({
        url: 'getIPandPort',
        async: false,
        success: function (res) {
            port = res.port;
            ip = res.ip;
        }
    });
    var ws = new WebSocket("ws://" + ip + ":" + port + "/sokect");
    ws.onopen = function () {
        console.log("连接成功")
    }
    ws.onmessage = function (evt) {
        var msg = JSON.parse(evt.data);
        console.log(msg);

    };
    ws.onclose = function () {
        console.log("连接已关闭...");

    };
</script>
<script>
    $.ajax({
        url: 'getCoutn',
        async: false,
        success: function (res) {

        }
    });
</script>
</body>
</html>